<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="index.css" />

    <title>慕课网</title>
  </head>
  <body>
    <header>
      <div id="head">
        <!-- 菜单栏左边icon -->
        <div id="moocIcon">
          <a href="https://www.icourse163.org/">
            <img src="images/moocIcon.png" alt="" />
          </a>
        </div>

        <!-- 导航菜单栏 -->
        <div id="nav">
          <ul class="nav_Ul">
            <li class="c_triangle">
              <a href="#">课程</a><span class="triangle"></span>
              <div class="index_nav_frame_line_center">
                <div id="channel_panel">
                  <div id="channel_shape"></div>
                  <div id="channel_content">
                    <h1>中国大学MOOC，为你提供一流的大学教育</h1>
                    <h2>大学</h2>
                    <div class="classfiy">
                      <ul>
                        <li><a href="#">国家精品</a></li>
                        <li><a href="#">计算机</a></li>
                        <li><a href="#">外语</a></li>
                        <li><a href="#">理学</a></li>
                        <li><a href="#">工学</a></li>
                        <li><a href="#">经济管理</a></li>
                        <li><a href="#">心理学</a></li>
                        <li><a href="#">文史哲</a></li>
                        <li><a href="#">艺术设计</a></li>
                        <li><a href="#">医药卫生</a></li>
                        <li><a href="#">教育教学</a></li>
                        <li><a href="#">法学</a></li>
                        <li><a href="#">农林园艺</a></li>
                        <li><a href="#">体育运动</a></li>
                        <li><a href="#">音乐与舞蹈</a></li>
                        <li><a href="#">养生保健</a></li>
                        <li><a href="#">兴趣爱好</a></li>
                      </ul>
                    </div>
                    <h2>升学/择业</h2>
                    <div class="classfiy">
                      <ul>
                        <li><a href="#">期末不挂</a></li>
                        <li><a href="#">22考研</a></li>
                        <li><a href="#">22/23考研</a></li>
                        <li><a href="#">四六级英语</a></li>
                        <li><a href="#">实用英语</a></li>
                        <li><a href="#">限时公开课</a></li>
                        <li><a href="#">考证就业</a></li>
                        <li><a href="#">精选微课</a></li>
                      </ul>
                    </div>
                    <h2>终身学习</h2>
                    <div class="classfiy">
                      <ul>
                        <li><a href="#">名师专栏</a></li>
                        <li><a href="#">音乐学院</a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </li>

            <li>
              <a href="#">学校</a>
            </li>
            <li>
              <a href="#">学校云</a>
            </li>
            <li>
              <a href="#">慕课堂</a>
            </li>
            <li>
              <a href="#">下载APP</a>
            </li>
          </ul>
        </div>

        <!-- 导航搜索 -->
        <div id="search">
          <input type="text" class="s_text" placeholder="搜索感兴趣的课程" />
          <span class="s_icon"></span>
        </div>

        <!-- 登录注册 -->
        <div id="re_log">
          <a href="#" class="logIn">登录</a>
          <span>|</span>
          <a href="#" class="register">注册</a>
        </div>
      </div>
    </header>
    <div id="slide_carousel">
      <div id="slide_nav">
        <ul class="slide_nav_ul">
          <li>
            <a href="#">国家精品</a>
          </li>
          <li>
            <a href="#">计算机</a>
            <a href="#">大数据与人工智能</a>
            <span>/</span>
            <a href="#">软件工程</a>
          </li>
          <li>
            <a href="#">外语</a>
            <a href="#">听力</a>
            <span>/</span>
            <a href="#">口语</a>
            <span>/</span>
            <a href="#">协作</a>
            <span>/</span>
            <a href="#">翻译</a>
          </li>
          <li>
            <a href="#">理学</a>
            <a href="#">数学</a>
            <span>/</span>
            <a href="#">物理</a>
            <span>/</span>
            <a href="#">化学</a>
            <span>/</span>
            <a href="#">天文学</a>
            <span>/</span>
            <a href="#">地理科学</a>
            <span>/</span>
            <a href="#">生物科学</a>
            <span>/</span>
            <a href="#">大气与海洋</a>
          </li>
          <li>
            <a href="#">工学</a>
            <a href="#">力学</a>
            <span>/</span>
            <a href="#">材料</a>
          </li>
          <li>
            <a href="#">22/23考研</a>
            <a href="#">数学</a>
            <span>/</span>
            <a href="#">英语</a>
            <span>/</span>
            <a href="#">408计算机</a>
          </li>
          <li>
            <a href="#">期末不挂科</a>
            <a href="#">数学不挂科</a>
            <span>/</span>
            <a href="#">物理不挂科</a>
          </li>
          <li>
            <a href="#">应试英语</a>
            <a href="#">康哥四六级</a>
            <span>/</span>
            <a href="#">康哥考研英语</a>
            <span>/</span>
            <a href="#">万词班</a>
          </li>
          <li>
            <a href="#">实用英语</a>
            <a href="#">万词班</a>
            <span>/</span>
            <a href="#">新概念</a>
          </li>
          <li id="more">
            <a>更多<span>></span></a>
          </li>
          <li class="more_li">
            <a href="#">经济管理</a>
            <a href="#">经济</a>
            <span>/</span>
            <a href="#">金融</a>
            <span>/</span>
            <a href="#">电商管理</a>
          </li>
          <li class="more_li"><a href="#">心理学</a></li>
          <li class="more_li">
            <a href="#">文史哲</a>
            <a href="#">文学文化</a>
            <span>/</span>
            <a href="#">新闻传播</a>
            <span>/</span>
            <a href="#">哲学</a>
          </li>
          <li class="more_li">
            <a href="#">艺术设计</a>
            <a href="#">设计考研</a>
            <span>/</span>
            <a href="#">艺术学</a>
            <span>/</span>
            <a href="#">美术学</a>
          </li>
          <li class="more_li">
            <a href="#">医药卫生</a>
            <a href="#">基础医学</a>
            <span>/</span>
            <a href="#">临床医学</a>
            <span>/</span>
            <a href="#">公共卫生</a>
          </li>
          <li class="more_li">
            <a href="#">教育教学</a>
            <a href="#">教学方法</a>
            <span>/</span>
            <a href="#">教学能力</a>
            <span>/</span>
            <a href="#">信息化教学</a>
          </li>
          <li class="more_li">
            <a href="#">法学</a>
            <a href="#">法学</a>
            <span>/</span>
            <a href="#">思政</a>
            <span>/</span>
            <a href="#">社会</a>
          </li>
          <li class="more_li">
            <a href="#">农林园艺</a>
            <a href="#">植物</a>
            <span>/</span>
            <a href="#">动物</a>
            <span>/</span>
            <a href="#">生态</a>
          </li>
          <li class="more_li"><a href="#">音乐与舞蹈</a></li>
          <li class="more_li"><a href="#">21考研处分日</a></li>
          <li class="more_li">
            <a href="#">考证就业</a>
            <a href="#">公考</a>
            <span>/</span>
            <a href="#">公办技能</a>
          </li>
          <li class="more_li">
            <a href="#">名师专栏</a>
            <a href="#">热门专栏</a>
            <span>/</span>
            <a href="#">情商</a>
            <span>/</span>
            <a href="#">思维力</a>
          </li>
        </ul>
      </div>
      <div id="carousel_map">
        
      </div>
      <div id="log_in"></div>
    </div>

    <script type="text/javascript" src="index.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
  </body>
</html>
